* {
    box-sizing: border-box;
}

.body {
    margin: 0;
    padding: 0;
}

.container {
    display: grid;
    /*grid-template-columns: [start] 200px [line2] 150px [line3] 100px [end];*/
    /*grid-template-columns: repeat(3 ,150px);*/
    /*grid-template-columns: 100px minmax(100px, 250px);*/
    /*grid-template-columns: 100px min-content;*/
    /*grid-template-columns: 100px max-content;*/
    /*grid-template-columns: 100px auto auto;*/
    /*grid-template-columns: repeat(4, 1fr);*/
    grid-template-columns: repeat(4, auto);
    grid-template-rows: 100px 200px 150px;
    grid-template: repeat(4, auto) / repeat(4, auto);
    background-color: #bca0dc;
    padding: 20px;
}

.item {
    background-color: #7c5295;
    padding: 20px;
    margin: 20px;
    color: white;
}